style: stage UI 수정 #352
style: stage UI 수정 #352
Conversation
Walkthrough
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10분 Suggested reviewers
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In `@src/app/my/_ui/MyProfileContent/index.tsx`:
- Line 83: 해당 JSX div의 className("bg-gray-c-300 mb-4 rounded-lg p-4")가 프로젝트의
Prettier/Tailwind 클래스 정렬 규칙을 따르지 않아 CI에서 실패합니다; MyProfileContent 컴포넌트의 해당
div(className 속성)를 프로젝트의 표준 Tailwind 클래스 순서로 재정렬하고 저장 전 Prettier 또는 ESLint
--fix를 실행해 자동 정렬을 적용하세요 (대상 식별자: MyProfileContent 내 문제의 div의 className).
In `@src/app/university/search/SearchBar.tsx`:
- Line 62: SearchBar.tsx has a Prettier error due to unordered Tailwind/CSS
classes in the className prop; open the SearchBar component and locate the
className string on the element (the className in SearchBar.tsx) and sort the
classes to match the project's Prettier/Tailwind order used in CI (e.g., group
by layout, box-model, background/border, spacing, typography, state) so the
class list becomes deterministic and CI will pass; update only the className
string ordering and run Prettier to verify.
| </div> | ||
| {/* Profile Card */} | ||
| <div className="mb-4 rounded-lg bg-gray-50 p-4"> | ||
| <div className="bg-gray-c-300 mb-4 rounded-lg p-4"> |
There was a problem hiding this comment.
Prettier 오류가 납니다 — 클래스 순서를 정리해주세요.
CI 로그에 맞춰 클래스 순서를 바꿔야 통과합니다.
🧹 수정 제안
- <div className="bg-gray-c-300 mb-4 rounded-lg p-4">
+ <div className="mb-4 rounded-lg bg-gray-c-300 p-4">📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <div className="bg-gray-c-300 mb-4 rounded-lg p-4"> | |
| <div className="mb-4 rounded-lg bg-gray-c-300 p-4"> |
🧰 Tools
🪛 GitHub Actions: CI
[error] 83-83: Prettier formatting issue. Replace bg-gray-c-300 mb-4 rounded-lg with mb-4 rounded-lg bg-gray-c-300.
🤖 Prompt for AI Agents
In `@src/app/my/_ui/MyProfileContent/index.tsx` at line 83, 해당 JSX div의
className("bg-gray-c-300 mb-4 rounded-lg p-4")가 프로젝트의 Prettier/Tailwind 클래스 정렬
규칙을 따르지 않아 CI에서 실패합니다; MyProfileContent 컴포넌트의 해당 div(className 속성)를 프로젝트의 표준
Tailwind 클래스 순서로 재정렬하고 저장 전 Prettier 또는 ESLint --fix를 실행해 자동 정렬을 적용하세요 (대상 식별자:
MyProfileContent 내 문제의 div의 className).
manNomi
left a comment
manNomi
left a comment
There was a problem hiding this comment.
너무 깔끔하게 작업해주셔서 좋내요!!
시작이 좋아서 앞으로가 기대되요
추가로 별건아니지만 브랜치명을 조금더 상세하게 가져가도 좋을것 같아요
따로 규칙을 정하진 않지만
fix :style 보다는 fix : style-token 등 다소 모호한 표현보다는 상세하게 가져가도 좋을듯 해요
리뷰남긴거 확인하고 한번 수정해주셔도 좋을것 같아요!
| "gray-c": { | ||
| "100": "#ececec", | ||
| "200": "#e5e7eb", | ||
| "300": "#f9fafb", |
There was a problem hiding this comment.
피그마상에서도 해당 디자인을 가져가나요?
색상이 원래 없었는데 달라져서 그런지 확인한번 해주셔도 좋을것 같아요
피그마 디자인 토큰에 없는 색상인데 누락된것인지 gray-c가 원래 존재하는지 피그마 dev모드 로 확인 해주시면 좋겠네요.
요약
- 피그마 dev모드에서 색상확인
- 피그마 dev 모드에서 디자인토큰이 gray-c 인지 확인
|
|
||
| :root { | ||
| --radius: 8px; | ||
| } |
There was a problem hiding this comment.
root 에서 수정하는것이 아닌 테일윈드 config에서 border가 누락된건지 보는게 좋아보여요!
root.css는 전역적인 css지만 저희는 테일윈드로 css 유틸리티를 제어하니까요!
결론
테일윈드 config 값이 제대로 들어가는지 확인필요
|
@enunsnv is attempting to deploy a commit to the solid-connection Team on Vercel. A member of the Team first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
2 participants
작업 내용
Login page
파견학교 검색 page
특이 사항
일부 디자인 시스템 추가 및 수정
리뷰 요구사항 (선택)
디자인 시스템 변동 사항이 있으므로 현 코드와 같이 수정해도 괜찮은지 검토 부탁드리겠습니다!